프리랜서 웹디자이너 웹퍼블리셔RELATION

RELATION 로고

DEV

[ js] 8. 기본 내장 객체 #2 배열

2024.01.20
북마크 작성자 정보
Object.Array


unsift()
배열의 맨 앞에 요소를 추가
let arry = ["a", "b", "c", "d"];
arry.unshift("first", "second");

console.log( arry );
// ['fitst', 'second', 'a', 'b', 'c']


puch() 
배열의 끝에 하나 이상의 요소를 추가하고 길이를 반환한다.
const animals = ['pigs', 'goats', 'sheep'];
const count = animals.push('cows');

console.log(count);
// Expected output: 4

console.log(animals);
// Expected output: Array ['pigs', 'goats', 'sheep', 'cows']

animals.push('chickens', 'cats', 'dogs');
console.log(animals);
// Expected output: Array ['pigs', 'goats', 'sheep', 'cows', 'chickens', 'cats', 'dogs']

shift()
배열에서 첫번째 요소를 제거하고 그값을 반환한다.

pop()
배열에서 마지막 요소를 제거하고 그값을 반환한다.
var myFish = ['angel', 'clown', 'mandarin', 'sturgeon'];
var popped = myFish.pop();

console.log(myFish); // ['angel', 'clown', 'mandarin' ]
console.log(popped); // 'sturgeon'
출처 : Array.prototype.pop() - JavaScript | MDN (mozilla.org)

splice("시작위치", "제거건수", ["요소","요소"]) 
요소를 제거 후 새로운 요소를 추가합니다.
let arry = ["a", "b", "c", "d"];
arry.splice(2,2,["k","j"]);

map()
배열 내의 모든 요소 각각에 대해하여 주어진 함수를 호출한 결과 모아 새로운 배열로 반환한다.
const array1 = [1, 4, 9, 16];

// Pass a function to map
const map1 = array1.map((x) => x * 2);

console.log(map1);
// Expected output: Array [2, 8, 18, 32]
새로운 배열 요소를 생성하는 함수. 다음 세 가지 인수를 가집니다.
- currentValue : 처리할 현재 요소.
- index (option): 처리할 현재 요소의 인덱
- array (option): map()을 호출한 배열
arr.map(callback(currentValue[, index[, array]])[, thisArg])
var numbers = [1, 4, 9];
var doubles = numbers.map(function (num) {
  return num * 2;
});
// doubles는 이제 [2, 8, 18]
// numbers는 그대로 [1, 4, 9]
let users = [
  {firstName : "Susan", lastName: "Steward"},
  {firstName : "Daniel", lastName: "Longbottom"},
  {firstName : "Jacob", lastName: "Black"}
];

let userFullnames = users.map(function(element){
    return `${element.firstName} ${element.lastName}`;
})

console.log(userFullnames);
// ["Susan Steward", "Daniel Longbottom", "Jacob Black"]
 

spread(...) 연산자

let arrA = [1, 2, 3];
let arrB = [...arrA];

arrB[0] = 10;

console.log(arrA);
// [1, 2, 3]
console.log(arrB);
// [10, 2, 3]

Filter()
배열에서 주어진 함수를 만족하는 모든 요소를 새로은 배열로 만든다.
let a = [1,2,3];
let new_a = a.filter((val)=> val === 3 );  /* a의 요소 중 3과 같은 조건 새로운 배열로 만든다.  */
console.log(new_a); // [3]


from()
기존 배열을 복사하여 새로운 배열을 만듭니다.
let arrA = [1, 2, 3];
let arrB = Array.from(arrA);

arrB[0] = 10;

console.log(arrA);
// [1, 2, 3]
console.log(arrB);
// [10, 2, 3]

concat()
매개변수로 입력한 배열의 요소를 모두 합쳐 배열을 만들어 리턴합니다.
const arr = [1, 2, 3];
const newArr = arr.concat('a', ['b', 'c'], 'abc');

document.writeln(arr + '
'); // [1, 2, 3]
document.writeln(newArr.length + '
'); // 7
document.writeln(newArr); // [1, 2, 3, 'a', 'b','c', 'abc']

sort() : 배열 요소를 정렬
revers() : 배열의 순서를 반대로 
slice() : 지정한 요소를 리턴 
join() : 배열 안의 모든 요소를 문자열로 만들어 리턴합니다. 



출처 : 
JavaScript Map - JS.map() 함수 사용 방법 (배열 메소드) (freecodecamp.org)
https://developer-talk.tistory.com/325
출처: https://developer-talk.tistory.com/325 [DevStory:티스토리]

이 포스트 공유하기

답글쓰기 전체목록